<template >
	<div>首页

		<slider :img="list"></slider>

	<ul class="mui-table-view mui-grid-view mui-grid-9">
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 "><router-link to="/news/newslist">
		                    <span class="mui-icon mui-icon-home"></span>
		                    <div class="mui-media-body">Home</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 "><router-link to="/photo/photoList">
		                    <span class="mui-icon mui-icon-email"></span>
		                    <div class="mui-media-body">Email</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 "><router-link to="/goods/goodslist">
		                    <span class="mui-icon mui-icon-chatbubble"></span>
		                    <div class="mui-media-body">Chat</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 "><router-link to="#">
		                    <span class="mui-icon mui-icon-location"></span>
		                    <div class="mui-media-body">location</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 "><router-link to="#">
		                    <span class="mui-icon mui-icon-search"></span>
		                    <div class="mui-media-body">Search</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 "><router-link to="#">
		                    <span class="mui-icon mui-icon-phone"></span>
		                    <div class="mui-media-body">Phone</div></router-link></li>
		            
		        </ul>

	</div>

</template>
<script type="es6">

	import { Swipe, SwipeItem } from 'mint-ui';
	import slider from './account/slider.vue'


	export default{
		components:{
			slider
		},

		data(){
			console.log(this)
			return{
				
				list:[]
			}
		},
		created(){
			this.getData()
		},
		methods: {
  			handleChange(index) {

			  },
			getData(index){
				this.$http.get("http://vue.studyit.io/api/getlunbo").then(function(data){
						this.list = data.body.message
				})
			}

		}
	}

</script>
<style scoped>




	.mui-grid-view.mui-grid-9{
		background-color:#fff;
	}

	.mui-grid-view.mui-grid-9 .mui-table-view-cell{
		border-right:0px;
		border-bottom:0px; 
	}
	.mui-grid-view.mui-grid-9{
		border-top:0px;
		border-left:0px; 
	}
	.mui-icon-home:before,
	.mui-icon-email:before,
	.mui-icon-chatbubble:before,
	.mui-icon-location:before,
	.mui-icon-search:before,
	.mui-icon-phone:before{
		content: '';
		display: inline-block;
		width: 50px;
		height: 50px;
		background-repeat: round;
	}
	
	.mui-icon-home:before{		
		background-image: url(../../statics/imgs/1.png);
	}

	.mui-icon-email:before{		
		background-image: url(../../statics/imgs/2.png);		
	}
	.mui-icon-chatbubble:before{		
		background-image: url(../../statics/imgs/3.png);		
	}
	.mui-icon-location:before{		
		background-image: url(../../statics/imgs/4.png);		
	}
	.mui-icon-search:before{		
		background-image: url(../../statics/imgs/5.png);		
	}
	.mui-icon-phone:before{		
		background-image: url(../../statics/imgs/6.png);		
	}

</style>
